<template>
    <block v-if="scene == 1154">
        <pyq-open-chunk></pyq-open-chunk>
    </block>
    <block v-else>
        <view class="pages col-3e bg-fff">
            <view class="kaiNav bg-fff boxShadow" v-if="kaiList.length > 0">
                <up-tabs :list="kaiList" :current="currKai" lineColor="#007235" keyName="title" @click="changeKai"></up-tabs>
            </view>
            
            <view class="body">
                <!-- <view class="typeTabs col-grey font13">
                    <block v-for="(item,index) in tabs" :key="index">
                        <view class="btn" :class="[tabsCurrVal == item.value ? 'active col-fff' : '']" @click="swichMenu(index)">
                            {{item.name}}
                        </view>
                    </block>
                </view> -->
                
                <!-- <block v-if="tabsCurrVal==='evaluation'">
                    <block v-if="evaluList.length>0">
                        <block v-for="(item, index) in evaluList" :key="index">
                            <evaluation-item :item="item" :kaiId="kaiId"></evaluation-item>
                        </block>
                        <view class="lineHeight15 top-15 font10 col-grey">
                            免责声明：{{ disclaimer }}
                        </view>
                    </block>
                </block> -->
                
                <block v-if="tabsCurrVal==='types'">
                    <block v-if="houseTypeList.length>0">
                        <block v-for="(item, index) in houseTypeList" :key="index">
                            <type-item :item="item"></type-item>
                        </block>
                        <!-- <view class="lineHeight15 top-15 font10 col-grey">
                            免责声明：{{ disclaimer }}
                        </view> -->
                        <view class="flex font13 col-grey txt-center top-20">暂无更多</view>
                        <up-gap height="40"></up-gap>
                    </block>

                    <up-empty text="暂无数据" mode="list" marginTop="100" v-if="houseTypeList.length === 0"></up-empty>
                </block>
            </view>
            <!-- #ifdef MP-WEIXIN -->
            <!-- <block v-if="kaiList.length>0"> -->
                <!-- <view class="hideBox"></view> -->

    			<!-- <bind-seller-bottom-bar :detail="recommendAdviser" v-if="recommendAdviser&&recommendAdviser.avatar_url"></bind-seller-bottom-bar> -->

                <!-- <house-type-bottom-bar :detail="productInfo" @contactPang="showQrcode=true" v-else></house-type-bottom-bar> -->
            <!-- </block> -->
            <!-- #endif -->

            <!-- <u-modal v-model="showQrcode" border-radius="40" :show-title="false" :show-confirm-button="false" :mask-close-able="true">
                <dialog-qrcode :qrcode="productInfo.qr_url"></dialog-qrcode>
            </u-modal> -->
        </view>
    </block>
</template>
<script>
    import TypeItem from './components/type-item.vue';
    import EvaluationItem from './components/evaluation-item.vue';
    import { mapState, mapActions } from 'pinia';
    import { useUserInfoStore, useConfigStore, useIndexStore } from '@/store/index';
    import { isBoolean } from '@/common/common';
    import { panListAPI, panHouseTypeAPI } from '@/common/api';
    import { productInfoAPI, houseEvaluationList } from '@/common/api/house';
    // import { dispatchClient } from '@/common/api-adviser';
    // import { getSellerInfoById } from '@/common/api/adviser';

	export default {
        components: {
            TypeItem,
            EvaluationItem
        },
		data() {
			return {
                kaiId: '',
                currKai: 0,
                kaiList: [],
				product_id: '',
                tabsCurrVal: 'types',
                productInfo: {},
                showQrcode: false,
                start_time: 0,
                title: '',
                share: false,
                recommendAdviser: {}
            }
		},
        computed:{
            ...mapState(useIndexStore, ['disclaimer']),
            ...mapState(useConfigStore, ['scene','puid']),
            ...mapState(useUserInfoStore, ['userInfo']),
            
            tabs: function() {
                let arr = [{name: '户型图', value: 'types', show: true}];
                // if(this.kaiList.length==0) return arr;
                // let currKaiItem = this.kaiList[this.currKai];
                // if(currKaiItem.evaluationList.length === 0) return arr;
                // arr.unshift({name: '户型评测', value: 'evaluation', show: true});
                return arr;
            },
            
            evaluList: function() {
                if(this.kaiList.length==0) return [];
                let currKaiItem = this.kaiList[this.currKai];
                return this.kaiList[this.currKai].evaluationList;
            },
            
            houseTypeList: function() {
                if(this.kaiList.length==0) return [];
                let currKaiItem = this.kaiList[this.currKai];
                return this.kaiList[this.currKai].typeList;
            }
        },
        onShareAppMessage(res) {
            return {
                title: `【${this.title}】户型图，点击了解详情`,
                path: `/pages/product/house-type/list/page?productId=${this.product_id}&kaiId=${this.kaiId}&title=${this.title}&share=true&puid=${this.userInfo.id}&prepage=楼盘户型评测列表-${this.product_id}-${this.title}`,
            }
        },
        //#ifdef MP-WEIXIN
        onShareTimeline() {
            return {
                title: `【${this.title}】户型图，点击了解详情`,
                query: `productId=${this.product_id}&kaiId=${this.kaiId}&puid=${this.userInfo.id}&share=true&title=${this.title}&prepage=楼盘户型评测列表-${this.product_id}-${this.title}`
            }
        },
        //#endif
		onLoad(options) {
            let { productId='', kaiId='', type='', puid='', share=false, title='' } = options;
            
            //朋友圈进入小程序快照场景
            if(this.scene == 1154) return;
            
			this.product_id = productId&&productId!=='undefined'?productId:'';
            this.title = title&&title!=='undefined'?title:'';
            this.share = isBoolean(share);
            if(kaiId&&kaiId!=='undefined') {
                this.kaiId = kaiId
            }
            this.tabsCurrVal = type&&type!=='undefined'?type:'types';
            this.start_time = (new Date()).getTime();
            if(puid&&puid!=='undefined') {
                this.setPuid(puid)
            }
			let that = this;

            if(this.product_id){
                uni.$check_and_login(function () {
                    that.init()
                })
            }
        },

        methods: {
            ...mapActions(useConfigStore, ['setPuid']),

            async init() {
                //绑定客户
                // await dispatchClient({
                //     share: this.share,
                //     puid: this.puid,
                //     pid: this.product_id
                // })

                this.getPanList();
                
                //根据顾问ID获取被绑定的顾问信息
                // if(this.puid && this.puid !== this.userInfo.id) {
                //     let sellInfoRes = await getSellerInfoById({id: this.puid, productId: this.product_id});
                //     if(sellInfoRes.status === 0) {
                //         if(sellInfoRes.detail.product_id && sellInfoRes.detail.product_id == this.product_id) {
                //             this.recommendAdviser = sellInfoRes.detail;
                //         }
                //     }
                // }
            },
            
            //获取开盘id
            async getPanList(){
                let productRes = await productInfoAPI(this.product_id);
                if(productRes.status ===0) {
                    this.productInfo = productRes.detail;
                }
                let panData = await panListAPI(this.product_id);
                if(panData.status === 0) {
                    if(panData.detail.length > 0) {
                        this.kaiList = panData.detail.map(item => ({
                            ...item,
                            typeList: [],
                            evaluationList: []
                        }))
                        if(this.kaiId) {
                            this.currKai = this.kaiList.findIndex(item => item.id == this.kaiId);
                        }
                    }
                    this.changeKai({index: this.currKai});
                }else {
                    uni.$u.toast(panData.detail)
                }
            },
            
            //切换开盘
            async changeKai({index=0}){
                if(this.kaiList.length === 0) return;
                uni.showLoading({
                	title: '数据加载中',
                	mask: true
                })
                this.currKai = index;
                this.kaiId = this.kaiList[index].id;
                let findKai = this.kaiList[index];
                if(findKai.typeList.length===0) {
                    let typeRes = await panHouseTypeAPI(this.kaiId);
                    if(typeRes.status ===0) {
                        findKai.typeList = typeRes.detail;
                        uni.hideLoading();
                    }else {
                        uni.hideLoading();
                        uni.$u.toast(typeRes.detail);
                    }
                }
                if(findKai.evaluationList.length===0) {
                    let evaluationRes = await houseEvaluationList(this.kaiId);
                    if(evaluationRes.status ===0) {
                        findKai.evaluationList = evaluationRes.detail;
                        uni.hideLoading();
                    }else {
                        uni.hideLoading();
                        uni.$u.toast(evaluationRes.detail);
                    }
                }
                uni.hideLoading();
                let findMenuI = this.tabs.findIndex(item => item.value === this.tabsCurrVal);
                this.swichMenu(findMenuI>-1?findMenuI:0);
                uni.hideLoading();
            },
            
            //切换tabs
            swichMenu(index=0){
                this.tabsCurrVal = this.tabs[index].value;
            }
		}
	}
</script>

<style lang="scss" scoped>
	.pages{
        line-height: 1;
		min-height: 100vh;
        .kaiNav{
            position: sticky;
            top: 0;
            left: 0;
            z-index: 100;
            width: 100%;
        }
        .typeTabs{
            margin-top: 40rpx;
            height: 80rpx;
            white-space: nowrap;
            .btn{
                display: inline-block;
                width: 120rpx;
                height: 70rpx;
                line-height: 70rpx;
                text-align: center;
                margin-right: 20rpx;
                background-color: $uni-bg-color-grey;
            }
            .active{
                font-weight: bold;
                background-color: $theme-color;
            }
        }
        .body{
            padding: 0rpx 28rpx;
        }
        .hideBox{
            height: 170rpx;
        }
	}
</style>
